<template>
  <div v-loading="loading">
    <el-card style="min-height: 700px">
      <div slot="header" class="clearfix">
        <span>生产审批流</span>
      </div>
      <el-timeline>
        <el-timeline-item
          v-for="(item, index) in workflows"
          :key="index"
        >
          {{ item }}
        </el-timeline-item>
      </el-timeline>
    </el-card>
  </div>
</template>
<script>
import { get } from '@/api/workflow'
import { getNext } from '@/api/workflow'
import { getLast } from '@/api/workflow'
import { save } from '@/api/workflowresult'
export default {
  name: 'WorkflowChart',
  data() {
    return {
      workflows: ['市场部经理', '责任部门', '责任部门经理'],
      loading: false
    }
  },
  created() {
  },
  methods: {
    // 获取 easy-mock 的模拟数据
    getQuality(id) {
      this.loading = true
      get(id).then(res => {
        this.loading = false
        this.workflow = res.data.data
        this.quality = res.data.data.qcProduce
        this.form.refId = this.workflow.id
        this.form.workNode = this.workflow.workNode
        this.workflowResults = res.data.data.list
      })
    },
    goBack() {
      this.$router.push({ path: 'qcProduceIndex' })
    },
    toNext() {
      getNext(this.$route.query.id).then(res => {
        this.$router.push({ path: 'qcProduceView', query: { id: res.data.data }})
        if (this.$route.query.id) {
          this.getQuality(this.$route.query.id)
        }
      })
    },
    toLast() {
      getLast(this.$route.query.id).then(res => {
        this.$router.push({ path: 'qcProduceView', query: { id: res.data.data }})
        if (this.$route.query.id) {
          this.getQuality(this.$route.query.id)
        }
      })
    },
    handleEdit() {
      this.form.refId = this.workflow.id
      this.form.workNode = this.workflow.workNode
      this.dialogVisible = true
    },
    saveResult() {
      this.loading = true
      save(this.form).then(res => {
        this.getQuality(this.$route.query.id)
        this.loading = false
        this.$message.success('保存成功')
        this.dialogVisible = false
      })
    }
  }
}
</script>

<style scoped>
  .handle-box {
    margin: 20px;
  }

  .handle-select {
    width: 120px;
  }

  .handle-input {
    margin: 10px;
    width: 300px;
    display: inline-block;
  }
  .table {
    width: 100%;
    font-size: 14px;
  }
  .red {
    color: #ff0000;
  }
  .hand-btn {
    margin: 5px;
  }
</style>
